<template>
  <el-dialog title="上传" v-model="uploadVisible" width="400px">
    <el-upload drag action="#" :show-file-list="false" :accept="accept" :http-request="upload">
      <i class="el-icon-upload"></i>
      <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
      <template #tip>
        <div class="el-upload__tip">{{ tip }}</div>
      </template>
    </el-upload>
  </el-dialog>
</template>

<script lang="ts">
export default {
  name: 'AutumnUpload'
}
</script>

<script lang="ts" setup>
import { ref } from 'vue'
import { UploadRequestOptions } from 'element-plus'

defineProps({
  accept: {
    type: String,
    default() {
      return ''
    }
  },
  tip: {
    type: String,
    default: () => ''
  }
})

const uploadVisible = ref<boolean>(false)
const open = () => {
  uploadVisible.value = true
}
defineExpose({
  open
})

const emits = defineEmits(['upload'])
const upload = (e: UploadRequestOptions) => {
  emits('upload', e.file)
  uploadVisible.value = false
}
</script>
